<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>添加社区</title>
    <link rel="stylesheet" href="__ROOT__/static/admin/css/pintuer.css">
    <link rel="stylesheet" href="__ROOT__/static/admin/css/admin.css">
    <script src="__ROOT__/static/admin/js/jquery.js"></script>
    <script src="__ROOT__/static/admin/js/pintuer.js"></script>
    <script src="__ROOT__/static/plugins/layer/layer.min.js"></script>
    <style>
        .show_file{
            padding: 0px 10px;
            height: 40px;
            line-height: 40px;
            position: relative;
            cursor: pointer;
            color: #fff;
            background: #00AAEE;
            border: 1px solid #ddd;
            border-radius: 4px;
            overflow: hidden;
            display: inline-block;
            *display: inline;
            *zoom: 1
        }

        .show_file input{
            position: absolute;
            font-size: 100px;
            right: 0;
            top: 0;
            opacity: 0;
            filter: alpha(opacity=0);
            cursor: pointer
        }

        .show_file:hover {
            color: #fff;
            background: #0099CC;
            border-color: #ccc;
            text-decoration: none
        }
    </style>
</head>
<body>
<div class="panel admin-panel margin-top">
    <div class="panel-head" id="add"><strong><span class="icon-pencil-square-o"></span>添加社区</strong></div>
    <div class="body-content">
        <div  class="form-x" action="" >
            <div class="form-group">
                <div class="label">
                    <label>社区名称：</label>
                </div>
                <div class="field">
                    <input type="text" class="input w50" name="community_name" id="community_name" value="" data-validate="required:请输入社区标题" />
                    <div class="tips"></div>
                </div>
            </div>


            <div class="form-group">
                <div class="label">
                    <label>图片：</label>
                </div>
                <div class="field">
                    <span id="image"></span>
                    <div class="show_file">
                        <form id="upload" action="" enctype="multipart/form-data">
                            <input type="file" class="button bg-blue margin-left" id='community_url' onchange="upload()" name="img" style="float:left;">
                        </form>
                        <span id="image1">浏览上传</span>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <div class="label">
                    <label></label>
                </div>
                <div class="field">
                    <button class="button bg-main " type="submit" onclick="submit()"> 保存</button>
                    <a class="button bg-main " href="{:url('admin/Community/index')}"> 返回</a>
                </div>
            </div>
        </div>
    </div>
</div>
<script>

    /*上传图片*/
    function upload() {
        var formData = new FormData($('#upload')[0]);
        $.ajax({
            cache: false,
            type: "POST",
            url: "{:url('admin/Community/addKnowsList')}",
            data: formData,
            async: false,
            contentType: false,
            processData: false,
            success: function (data) {
                //把上传路径写到数据库
                var params = {};
                params.community_url = data;
                $('#image').html('<img id="image_url" src="'+'__ROOT__/'+params.community_url+'" />');
            }
        });
    }

    // 提交
    function submit() {
        var data = {};
        data.community_name = $('#community_name').val();
        data.community_url = $('#image_url').attr('src');
        console.dir(data);
        $.post("{:url('admin/Community/createCommunityList')}",data, function (response) {
            if(response > 0){
                layer.msg('添加成功', {icon: 5});
                window.location.href = "{:url('admin/Community/index')}";
            }else {
                layer.msg('添加失败', {icon: 5});
            }

        });
    }


</script>
</body>
</html>